<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax实例</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<h1>Django and Ajax JSON Example</h1>
    <button id="fetchData">Fetch Data</button>
    <div id="output"></div>

    <script>
        $('#fetchData').click(function() {
            $.ajax({
                url: '/api/get-data/',
<!--                // Django 的视图接口-->
                method: 'GET',
                dataType: 'json',
                success: function(data) {
<!--                // 显示返回的 JSON 数据-->
<!--                    $('#output').html(`<pre>${JSON.stringify(data, null, 2)}</pre>`);-->
                },
                error: function(xhr, status, error) {
                    console.error('Error fetching data:', error);
                }
            });
        });
    </script>
</body>
</html>